<?php 
	$f_name = "";
	$l_name= "";
	$tran_id ="";
	$create_dt = "";
	$cust_id = "";
	$tcdv = 0;
	$km = 0;
	$thanhtien = 0;
	$iscompleted = 0;
	$phieu_gt = 0;
	$tienmat = 0;
	
	if(!empty($customer)){
		$f_name = $customer->F_Name;
		$l_name = $customer->L_Name;
	}
	if(!empty($result)){
		$tran_id =$result->Tran_ID;
		$create_dt = date("d/m/Y",$result->Create_Dt);
		$cust_id = $result->Cust_ID;
		$tcdv = $result->Price;
		$km = $result->Discount_Percent;
		$thanhtien = $result->Money;
		$iscompleted = $result->Completed;
		$tienmat = $thanhtien + $phieu_gt;
	}
	
?>
<script type="text/javascript">
 $(function() {
	//init khoi tao
	reset_service();
	//attach autocomplete
	$( "#nguoitip" )
	// don't navigate away from the field on tab when selecting an item
      .bind( "keydown", function( event ) {
        if ( event.keyCode === $.ui.keyCode.TAB &&
            $( this ).data( "ui-autocomplete" ).menu.active ) {
          event.preventDefault();
        }
      })
	.autocomplete({
		source: "<?php echo base_url()?>transaction/searchnv",
		focus: function() {
          // prevent value inserted on focus
          return false;
        },
		minLength: 1,
		select: function( event, ui ) {
			var friend = ui.item.value,
			span = $("<span>").text(friend),
			a = $("<a>").addClass("remove").attr({
					href: "javascript:",
					title: "Remove " + friend
				}).text("x").appendTo(span);
						
			//add friend to friend div
			span.insertBefore("#nguoitip");	
			span.append("<input type='hidden' class='ee_id' name='ee_id[]' value='"+ui.item.id+"' />");
			$("#nguoitip").val("");
			return false;
		}
	}).change(function(){
					// alert("chjange");
					$("#nguoitip").val("").css("top", 2);		
					$("#nguoitip").focus();
			});
			
			//auto complete khach hang
	$( "#khachhang" )
	// don't navigate away from the field on tab when selecting an item
      .bind( "keydown", function( event ) {
        if ( event.keyCode === $.ui.keyCode.TAB &&
            $( this ).data( "ui-autocomplete" ).menu.active ) {
          event.preventDefault();
        }
      })
	.autocomplete({
		source: "<?php echo base_url()?>customer/search",
		focus: function() {
          // prevent value inserted on focus
          return false;
        },
		minLength: 1,
		select: function( event, ui ) {
			var friend = ui.item.value,
			span = $("<span>").text(friend),
			a = $("<a>").addClass("remove").attr({
					href: "javascript:",
					title: "Remove " + friend
				}).text("x").appendTo(span);
						
			//add friend to friend div
			span.insertBefore("#khachhang");	
			span.append("<input type='hidden' class='cust_id' name='cust_id' id='cust_id' value='"+ui.item.id+"' />");
			$("#khachhang").val("");
			return false;
		}
	}).change(function(){
					// alert("chjange");
					$("#khachhang").val("").css("top", 2);		
					$("#khachhang").focus();
			});
				
				//add click handler to friends div
				$("#khachhangs").click(function(){
					//focus 'to' field
					$("#khachhang").focus();
				});
				
				//add live handler for clicks on remove links
				$(".remove", document.getElementById("khachhangs")).live("click", function(){
				
					//remove current friend
					$(this).parent().remove();
					
					//correct 'to' field position
					if($("#khachhangs span").length === 0) {
						$("#khachhang").css("top", 0);
					}				
				});		
	//them dich vu	
	$("#btnthemmoidv").click(function(event){
		event.preventDefault();
		//khoi tao dich vu moi
		reset_service();
	});
	
	//save transaction 
	$("#add_new").click(function(event){
		event.preventDefault();
		xl_giaodich(2);
	});
	
	//save dich vu
	$("#luuservice").click(function(event){
		event.preventDefault(); 
		xl_giaodich(1);
	});
	//end save dich vu
				
	$("#box_dichvu table tr").click(function(){
		var rel= $(this).attr("rel");
		if(rel=="") return;
		var url = "<?php echo base_url();?>transaction/getService";
		var arr_rel = rel.split(",");
		if(parseInt(arr_rel[0]) !== 0 && parseInt(arr_rel[0]) !== 1)
			url = "<?php echo base_url();?>transaction/getServicesVip";
		
		//lay thong tin service
		$(".box-phieu").hide("slow");
		$.ajax({
					type: 'post',
					url: url,
					data: {
						rel:rel
					},
					success: function(data){
							 var R = eval('(' + data + ')'); 
							 $("#vip").val(R.Vip);
							 $("#vipchild").val(R.vipchild);
							 $("#vipid").val(R.vipid);
							 $("#box_changed").val("1");
							 if(parseInt(R.Vip) == 0){
								 $(".styled-select").html(R.cb_services);
								 $("#gia").val(R.Gia);
								 $("#giam").val(R.Giam);
								 $("#tientip").val(parseInt(R.TienTip));
								 $("#ghichu").val(R.GhiChu);
								 $("#box_service_id").val(R.ID);
								 $("#box_isphieu").val(R.phieu);
								 $("#box_new").val(R.box_new);
								 $("#thanhtien").val(R.thanhtien);
								 $("#box_percent_serv").val(R.Percent_Serv);
								 $("#box_sosuat").val(R.SoSuat);
								 $("#box_tang").val(R.Tang);
								 $("#conlai").val(R.Conlai);								 
								 if(parseInt(R.phieu)==1){ //dag su dung phieu
									
									$(".box-phieu").show("slow");
								 }else{
									$(".box-phieu").hide("slow");
								 }
								 //nguoi tip
								 $("#nguoitip").val("");
								$("#friends span").remove();
								 var friend = R.e_Name,
								span = $("<span>").text(friend),
								a = $("<a>").addClass("remove").attr({
										href: "javascript:",
										title: "Remove " + friend
									}).text("x").appendTo(span);
											
								//add friend to friend div
								span.insertBefore("#nguoitip");	
								span.append("<input type='hidden' class='ee_id' name='ee_id[]' value='"+R.EE_ID+"' />");
								handler_remove("friends");
								$("#friends").parent().show("slow");
								$("#giam").parent().show("slow");									
								$("#tientip").parent().show("slow");									
								$("#thanhtien").parent().show("slow");
							}else{ //VIP
								$("#gia").val(R.Gia);
								$("#giam").val(R.Giam);
								$("#tientip").val(parseInt(R.TienTip));
								$(".styled-select").html(R.cb_services);
								$("#thanhtien").val(R.thanhtien);
								 if(parseInt(R.vipchild)==0){//vip parent
									$("#friends").parent().hide("slow");
									$("#giam").parent().show("slow");									
									$("#tientip").parent().hide("slow");									
									$("#thanhtien").parent().show("slow");
									$("#nguoitip").val("");
									$("#friends span").remove();
								 }else{ // vip child
									$("#friends").parent().show("slow");									
									$("#giam").parent().hide("slow");									
									$("#tientip").parent().hide("slow");									
									$("#thanhtien").parent().hide("slow");	
									//nguoi tip
									$("#nguoitip").val("");
									$("#friends span").remove();
									var friend = R.e_Name,
									span = $("<span>").text(friend),
									a = $("<a>").addClass("remove").attr({
										href: "javascript:",
										title: "Remove " + friend
									}).text("x").appendTo(span);
											
									//add friend to friend div
									span.insertBefore("#nguoitip");	
									span.append("<input type='hidden' class='ee_id' name='ee_id[]' value='"+R.EE_ID+"' />");	
									handler_remove("friends");
								 }
							}
					},
					statusCode:{
						404: function(){
							
						}
					}
		});	
		
	});
	//tinh toan tien dich vu
	$("#giam").change(function(){
		if(!isNaN($("#giam").val())){
			$("#thanhtien").val(parseInt($("#gia").val()) * (100 - parseInt($("#giam").val()))/100);
		}else{
			alert("Gia tri nhap khong hop le");
			$("#giam").val("0");
			$("#giam").focus();
		}
	});
	$("#gia").change(function(){
		if(!isNaN($("#gia").val())){
			$("#thanhtien").val(Math.round(parseInt($("#gia").val()) * (100 - parseInt($("#giam").val()))/100));
		}else{
			alert("Gia tri nhap khong hop le");
			$("#gia").val("0");
			$("#gia").focus();
		}
	});
	$("#thanhtien").change(function(){
		if(!isNaN($("#thanhtien").val())){
			$("#giam").val(Math.round(100*((parseInt($("#gia").val())- parseInt($(this).val()))/parseInt($("#gia'.$i.'").val()))));
		}else{
			alert("Gia tri nhap khong hop le");
			$("#thanhtien").val("0");
			$("#thanhtien").focus();
		}
	});
	
	$( "#dialog_DOB" ).datepicker({
			showOn: "button",
			changeYear:true,
			changeMonth:true,
			buttonImage: "<?php echo base_url();?>resources/images/calendar.gif",
			buttonImageOnly: true,
			dateFormat: 'dd/mm/yy'
		}).change(function(){
			
		});
		
		//init xl phieu
		xl_phieu();
 });
 
 //function handler remove
 function handler_remove(box){
	//add live handler for clicks on remove links
	$(".remove", document.getElementById(box)).live("click", function(){	
		//remove current friend
		$(this).parent().remove();				
	});		
 }
 function phieu_change(){
	$(".phieu select").change(function(){
		var selected = $(".phieu select[name='Phieu_ID'] option:selected").val();
		if(!selected){ //phieu moi
			$("#box_new").val("1");
			$("#gia").val("0");
			$("#giam").val("0");
			$("#gia").change();
		}else{//phieu cu
			
		}
	});
	$(".phieu select").change();
 }
 
 function xl_phieu(){
	$("#muaphieu").click(function(){
		//is phieu
		var isclick = $(this).is(":checked");			
		if(isclick){ //if check
			if(!$("#box_service_id").val()){
				alert("Hay chon dich vu o tren.");
				$(this).removeAttr("checked");
				return;				
			}
			//thoa dieu kien check
			$(".box-phieu").show("slow");
			$("#box_isphieu").val("1");
			//get phieu da co'
			var cust_id=$("#cust_id").val();
			if(!cust_id){
				return;//hack or not customer
			}
			$.ajax({
				type: 'post',
				url: '<?php echo base_url()?>transaction/getPhieuKH',
				data: {Cust_ID: cust_id
				},
				success: function(data){
					 var R = eval('(' + data + ')'); 
					 $(".phieu").html(R.html);
							  //
					phieu_change();
				},
				statusCode:{
					404: function(){
							
					}
				}
			});
		}else{ //bo check
			
			//thoa dieu kien bo check
			$("#box_isphieu").val("0");
		}
	});
 }
 //xl giao dich
 //c: Completed
 // c = 1 thay doi mot trong nhung dich vu 
 // c = 2 giao dich hoan tat
 function xl_giaodich(c){
	var arr = [];
		$(".ee_id").each(function(){
			arr.push($(this).val());
		});
		var gia = $("#gia").val();
		var giam = $("#giam").val();
		var tientip = $("#tientip").val();
		var ghichu = $("#ghichu").val();
		var id = $("#box_service_id").val();
		var phieu = $("#box_isphieu").val();
		var service_id = $("select[name='Serv_ID'] option:selected").val();
		var box_new = $("#box_new").val();
		var box_tran_id = $("#box_tran_id").val();
		if(!box_tran_id){ alert("Giao dich ko ton tai"); return false;}
		var thanhtien = $("#thanhtien").val();
		var cust_id = $("#cust_id").val();
		var create_dt = $("#Create_Dt").val();
		var box_percent_serv = $("#box_percent_serv").val();
		var box_sosuat = $("#box_sosuat").val();
		var box_tang = $("#box_tang").val();
		var conlai = $("#conlai").val();
		var box_changed = $("#box_changed").val();
		var vip = $("#vip").val();
		var vipchild = $("#vipchild").val();
		var vipid = $("#vipid").val();
		
		$.ajax({
					type: 'post',
					url: "<?php echo base_url();?>transaction/save",
					data: {
						ee_id:arr,
						gia:gia,
						giam:giam,
						tientip:tientip,
						ghichu:ghichu,
						id:id,
						phieu:phieu,
						service_id:service_id,
						box_new:box_new,
						box_tran_id:box_tran_id,
						thanhtien:thanhtien,
						cust_id:cust_id,
						create_dt:create_dt,
						box_percent_serv:box_percent_serv,
						box_sosuat: box_sosuat,
						box_tang: box_tang,
						completed: c,
						conlai:conlai,
						box_changed:box_changed,
						vip:vip,
						vipchild: vipchild,
						vipid: vipid
					},
					success: function(data){
						var R = eval('(' + data + ')'); 
						// console.log(R);
						// return;
						if(R.error){
						 //console.log(R);
							alert(R.msg);
						}else{
							location.href=R.url;
						}
					},
					statusCode:{
						404: function(){
							
						}
					}
		});
 }
 //xl su kien change dich vu
 function service_change(name){

		var serv_id = $("select[name='"+name+"']").val();
		var is_phieu = $("#box_isphieu").val();
		var box_service_id = $("#box_service_id").val();
		
		if(serv_id)
			$.ajax({
				type: 'post',
				url: '<?php echo base_url()?>transaction/getPromotion',
				data: {serv_id: serv_id,
				is_phieu:is_phieu,
				box_service_id:box_service_id
				},
				success: function(data){
					var R = eval('(' + data + ')'); 

					$("#tientip").val(R.TienTip);
					$("#giam").val(R.Discount_Percent);
					$("#box_percent_serv").val(R.Percent_Serv);

					$("#gia").val(R.Money);
					$("#thanhtien").val(R.Price);	
					if(parseInt(R.is_phieu) == 1){
						$("#conlai").val(R.conlai);
						$(".box-phieu").show("slow");
					}else{
						
					}
				},
				statusCode:{
					404: function(){
						
					}
				}
			});
		else{
			$("#gia").val("");
			$("#giam").val("");
			$("#nguoitip").val("");
			$("#friends span").remove();
			$("#tientip").val("");
			$("#ghichu").val("");
			$("#thanhtien").val("");
		}
}

function tinhlaiGia(){
	 //set price
	var stt = parseInt($("#stt").val());
	var Discount_Percent = 0;
	var Money = 0;
	var Price = 0;
	var i =1;
	for(i=1; i<=stt;i++){
		Discount_Percent += parseInt($("#giam"+i).val());
		Money += parseInt($("#gia"+i).val());
		Price += parseInt($("#thanhtien"+i).val());
	}
	$("#Money").val(Price);
	$("#Discount_Percent").val(Discount_Percent);
	$("#Price").val(Money);	
}
function reset_service(){
		$.ajax({
					type: 'post',
					url: "<?php echo base_url();?>transaction/strService",
					data: {	},
					success: function(data){
						var R = eval('(' + data + ')'); 
						$(".styled-select").html(R.cb_services);
					},
					statusCode:{
						404: function(){
							
						}
					}
		});
		$("#gia").val("");
		$("#giam").val("");
		$("#nguoitip").val("");
		$("#friends span").remove();
		$("#tientip").val("");
		$("#ghichu").val("");
		$("#thanhtien").val("");
	}
 </script>
 <style>
#add_new{
	background: url("<?php echo base_url()?>resources/images/save-b.png") no-repeat scroll 0 0 transparent;color: #000000;
    float: right;
    height: 60px;
    padding-left: 50px;
    padding-top: 27px;
    width: 78px;}
#box_khachhang{float:left;clear:both;width:540px;}
#box_khachhang span,#box_khachhang input{float:left;}
#box_khachhang input{background-color:#DDDDDD;border:0;height: 25px;}
#box_khachhang img{position:relative;top:5px;}
#khachhang{width:100px;}
#Create_Dt{width:70px;}
#khadd{ 
	cursor: pointer;
    position: relative;
    top: -5px;}
#box_dichvu{width:820px;}
#btnthemmoidv{background: url("<?php echo base_url()?>resources/images/btnAdd.png") no-repeat scroll 0 0 transparent;color: #000000;
    float: right;
    height: 34px;
    padding-left: 43px;
    padding-top: 18px;
    width: 103px;z-index:1000;position:relative;}
#box_dichvu table{position:relative;  margin-bottom: 10px;}
#box_dichvu table tr{cursor:pointer;}

#content{min-height:auto;}
span{display:inline-table;}
#chitiet{
	width:308px;
	float:left;
	border-radius: 10px;
	clear:both;
	background-color:#fff;
	border:1px solid #ddd;
	padding:10px;
}
#chitiet{
	width:280px;
	float:left;
	border-radius: 10px;
	clear:both;
	background-color:#fff;
	border:1px solid #ddd;
	padding:10px;
	margin-left:90px;
}
#chitiet .first{ text-align: left;
    width: 75px;float:left;}
#chitiet input{float:left;}

#chitiet input{background-color: #DDDDDD;
   padding: 5px;
   line-height: 1;
   border: 0;
   border-radius: 1px;
   height: 18px;}
#chitiet textarea{padding: 5px;
   line-height: 1;
   border: 0;
   border-radius: 1px;
	resize:none;background-color: #DDDDDD;border:0;width: 195px;}
	
#chitiet2{
	width:225px;
	float:left;
	border-radius: 10px;
	background-color:#fff;
	border:5px solid #CCCCCC;
	padding:10px;
	margin-left:5px;
	margin-left:65px;
}
#chitiet2 h3{margin-bottom:5px;}
#chitiet2 .first{ text-align: left;
    width: 82px;float:left;}
#chitiet2 input{float:left;}

#chitiet2 input{background-color: #DDDDDD;
    padding: 5px;
   line-height: 1;
   border: 0;
   border-radius: 1px;
   height: 18px;}
#chitiet2 textarea{padding: 5px;
   line-height: 1;
   border: 0;
   border-radius: 1px;
	resize:none;background-color: #DDDDDD;border:0;width: 195px;}
	
#chitiet3{
	width:225px;
	float:left;
	border-radius: 10px;
	background-color:#fff;
	border:1px solid #ddd;
	padding:10px;
	margin-left:5px;
}
#chitiet3 .first{ text-align: left;
    width: 75px;float:left;}
#chitiet3 input{float:left;}

   #chitiet3 input{background-color: #DDDDDD;
    padding: 5px;
   line-height: 1;
   border: 0;
   border-radius: 1px;
   height: 18px;}
#chitiet3 textarea{padding: 5px;
   line-height: 1;
   border: 0;
   border-radius: 1px;
	resize:none;background-color: #DDDDDD;border:0;width: 195px;}

.styled-select select {
   background: transparent;
   width: 330px;
   padding: 5px;
   line-height: 1;
   border: 0;
   border-radius: 1px;
   height: 34px;
   -webkit-appearance: none;
   }	
 .styled-select {
   width: 200px;
   height: 28px;
   overflow: hidden;
   background: url("<?php echo base_url()?>resources/images/dropdown.png") no-repeat right #ddd;
   border: 0;
   float:left;
   }
   
   .styled-select-phieu select {
   background: transparent;
   width: 250px;
   padding: 5px;
   line-height: 1;
   border: 0;
   border-radius: 1px;
   height: 34px;
   -webkit-appearance: none;
   }	
 .styled-select-phieu{
   width: 142px;
   height: 28px;
   overflow: hidden;
   background: url("<?php echo base_url()?>resources/images/dropdown.png") no-repeat right #ddd;
   border: 0;
   float:left;
   }
#luuservice{
	background: url("<?php echo base_url()?>resources/images/save-s.png") no-repeat scroll 0 0 transparent;color: #000000;
    float: right;
    height: 26px;
    width: 51px;
	padding-left: 30px;
    padding-top: 15px;
}
#friends{width:200px;float:left;border:0;padding:0;background-color: #DDDDDD;}
.isphieu{
	float:left;
}

.phieu select {
   background: transparent;
   width: 330px;
   padding: 5px;
   line-height: 1;
   border: 0;
   border-radius: 1px;
   height: 34px;
   -webkit-appearance: none;
   }	
 .phieu {
   width: 200px;
   height: 28px;
   overflow: hidden;
   background: url("<?php echo base_url()?>resources/images/dropdown.png") no-repeat right #ddd;
   border: 0;
   float:left;
   }
   .box-phieu{
		margin-bottom:5px;
		display:none;
   }
   .conlai{float:left;}
   .nodisplay{display:none;}
</style>
<h1>Thanh toan - Chi tiet</h1>
<div id="content">
	<?php if($iscompleted!=2):?>
	<a id="add_new" href="<?php echo base_url();?>transaction/">Luu</a>			
	<?php endif;?>
	<div id="box_khachhang">
		<span>Ten khach hang</span> <div id="khachhangs" class="ui-helper-clearfix" style="margin:0 5px;">
		<?php if(!empty($customer)){?><span><?php echo $f_name." ".$l_name;?><input type="hidden" value="<?php echo $cust_id;?>" name="cust_id" id="cust_id" class="cust_id"></span>
		<?php }?>
		<input type="text" id="khachhang" name="khachhang" value="" /></div>
		<div class="" style="float: left;">
		<span style="margin-right:5px;">Ngay</span> <input id="Create_Dt" type="text" name="Create_Dt" value="<?php echo $create_dt;?>"  />	
		</div>
	</div>
	<div id="box_dichvu" class="type1">
		<!--<a id="btnthemmoidv" href="#" alt="Them moi">Them moi</a> -->
		<table border="0" width="100%">
			<tr border="0">
				<th width="5%" class="first border-right" style="border-right: solid 3px #fff;">Stt</th>
				<th width="30%" class="border-right" style="border-right: solid 3px #fff;">Dich vu</th>
				<th width="10%" class="border-right" style="border-right: solid 3px #fff;">Gia tri dich vu</th>
				<th width="5%" class="border-right" style="border-right: solid 3px #fff;">Giam</th>
				<th width="10%" class="border-right" style="border-right: solid 3px #fff;">Nhan vien</th>
				<th width="10%" class="last r" style="">Tips</th>
				<!--<th width="30%" class="last" style="text-align:left;">Ghi chu</th>-->
			</tr>
			<?php foreach($services as $k => $item){ 
				if($k%2==1) $odd="odd"; else $odd="";
				if($item['SoSuat']=="")//ko fai phieu
					$rel= "0,".$item['ID'];
				else //phieu
					$rel="1,".$item['ID'];
			?>
			<tr rel="<?php echo $rel;?>" class="<?php echo $odd;?> child">
				<td class="c"><?php echo ($k+1);?></td>
				<td class="l"><?php echo $item['Serv_Full'];?></td>
				<td class="r"><?php echo formatcurrency($item['Gia']*1000);?></td>
				<td class="c"><?php echo $item['Giam']."%";?></td>
				<td class="l"><?php echo $item['e_Name'];?></td>
				<td class="r"><?php echo $item['TienTip'];?>k</td>
				<!--<td class="l"><?php echo $item['GhiChu'];?></td> -->
			</tr>
			<?php } ?>
			<?php foreach($services_vip as $i=> $vip){?>
				<tr rel="2,<?php echo $vip['ID'];?>">
					<td class="c"><?php echo (count($services) + $i + 1);?></td>
					<td><?php echo $vip['Serv_Name']."(".$vip['Name'].")";?></td>
					<td class="r"><?php echo formatcurrency($vip['Price']*1000); ?></td>
					<td class="c"><?php echo $vip['Giam']."%";?></td>
					<td class="l">---</td>
					<td class="r"><?php echo $vip['TienTip'];?>k</td>
				</tr>
				<?php foreach($vip['child'] as $child){?>
				<tr rel="3,<?php echo $child['ID'];?>">
					<td class="c">---</td>
					<td><?php echo "--- ".$child['Serv_Name']."(".$child['Name'].")";?></td>
					<td class="r">----</td>
					<td class="c"><?php echo $child['Giam']."%";?></td>
					<td>----<?php echo $child['e_Name'];?></td>
					<td class="r"><?php echo $child['Price'];?>k</td>
				</tr>
				<?php } ?>
			<?php }?>
			<!-- <tr rel="2" class="odd">
				<td class="c">2</td>
				<td class="l">Tam trang</td>
				<td class="r">2000</td>
				<td class="c">2%</td>
				<td class="l">bich</td>
				<td class="l">10k</td>
				<td class="l">miss u much</td>
			</tr>
			-->
		</table>			
	</div> 
	<!-- end box_dichvu -->
<?php if($iscompleted!=2):?>
<div id="chitiet">
	<div class="both" style="float: left;">
		<span class="first">Dich vu</span><div class="styled-select"><select></select></div>
	</div>
	<div class="both box-phieu" style="float: left; margin-top: 5px;">
		<span class="first">Con lai</span><div class="conlai"><input name="conlai" id="conlai" value="" /></div><span style="float:left;">suat</span>
	</div>
	<div class="both" style="float: left;margin-top:5px;display:none;">
		<span class="first">Gia</span> <input id="gia" type="text" name="gia" value="" size="20" />	
	</div>
	<div class="both" style="float: left;margin-top:5px;">
		<span class="first">KM</span> <input id="giam" type="text" name="giam" value="" size="20" />
	</div>
	<div class="both" style="float: left;margin-top:5px;">
		<span class="first">Nhan vien</span> <div id="friends" class="ui-helper-clearfix"><input id="nguoitip" size="10" type="text" name="nguoitip"/></div>
	</div>
	<div class="both" style="float: left;margin-top:5px;">
		<span class="first">Tips</span> <input id="tientip" type="text" name="tientip" value="" size="20" />
	</div>
	<div class="both" style="float: left;margin-top:5px;">
		<span class="first">Con lai</span> <input id="thanhtien" type="text" name="thanhtien" value="" size="20" />
	</div>
	<div class="both" style="float: left;margin-top:5px;display:none;">
		<span class="first">Ghi chu</span> <textarea id="ghichu" name="ghichu" cols="35" rows="4"></textarea>
	</div>
	<?php if($iscompleted!=2):?>
	<a alt="Luu" href="#" id="luuservice">Luu</a>
	<?php endif;?>
	<input type="hidden" id="box_service_id" name="box_service_id" value="" />
	<input type="hidden" id="box_isphieu" name="box_isphieu" value="" />
	<input type="hidden" id="box_new" name="box_new" value="0" />
	<input type="hidden" id="box_tran_id" name="box_tran_id" value="<?php echo $tran_id;?>" />
	<input type="hidden" id="box_percent_serv" name="box_percent_serv" value="" />
	<input type="hidden" id="box_sosuat" name="box_sosuat" value="1" />
	<input type="hidden" id="box_tang" name="box_tang" value="0" />
	<input type="hidden" id="box_changed" name="box_changed" value="0" />
	<input type="hidden" id="vip" name="vip" value="0" />
	<input type="hidden" id="vipchild" name="vipchild" value="0" />
	<input type="hidden" id="vipid" name="vipid" value="0" />
	<div class="both"></div>
</div><!-- end chitiet -->
<div id="chitiet2">
	<h3>HOA DON</h3>
	<div class="both" style="float: left;">
		<span class="first">Tong cong</span><input id="tcdv" disabled type="text" name="tcdv" value="<?php echo formatcurrency($tcdv*1000); ?>" size="20" />	
	</div>
	<div class="both" style="float: left;margin-top:5px;">
		<span class="first">Khuyen mai</span> <input id="tckhuyenmai" disabled type="text" name="tckhuyenmai" value="<?php echo $km; ?>" size="20" />	
	</div>
	<div class="both" style="float: left;margin-top:5px;">
		<span class="first">Gia thanh</span> <input style="border: 2px solid #4a4eec;" disabled id="giathanh" type="text" name="giathanh" value="<?php echo formatcurrency($thanhtien*1000);?>" size="19" />
	</div>
	<div class="both" style="float: left;margin-top:5px;">
		<span class="first">Phieu(GT)</span> <input id="phieu_gt" disabled type="text" name="phieu_gt" value="<?php echo formatcurrency($phieu_gt*1000); ?>" size="20" />	
	</div>
	<!-- phieu select option -- >
	<div class="both" style="float: left;margin-top:5px;">
		<span class="first">Phieu</span> <div class="styled-select-phieu"><select name="phieus"><option selected value="0">Khong phieu</option></select></div>
	</div>
	<!-- end phieu select option -->
	<div class="both" style="float: left;margin-top:5px;">
		<span class="first">Tien mat</span> <input id="tienmat" disabled type="text" name="tienmat" value="<?php echo formatcurrency($tienmat*1000);?>" size="20" />
	</div>
	<div class="both"></div>
</div><!-- end chitiet2 -->
<?php endif;?>
<div id="chitiet3" style="display:none;">
	<div class="both" style="float: left;">
		<span class="first">Tips</span><input id="tctips" type="text" name="tctips" value="" size="20" />	
	</div>
	<div class="both" style="float: left;margin-top:5px;">
		<span class="first">Dich vu %</span> <input id="tcdichvu" type="text" name="tcdichvu" value="" size="20" />	
	</div>
	<div class="both"></div>
</div><!-- end chitiet3 -->
</div><!-- end content -->
<div class="both" style="height:10px;"></div>
</div>
<script type="text/javascript">
	$(function(){
			
	});
</script>